<template>
	<section class="todoapp">
		<TodoHeader></TodoHeader>
		<TodoMain></TodoMain>
		<TodoFooter></TodoFooter>
	</section>
</template>

<script>
	// 样式引入 + 导入组件并注册使用
	import TodoMain from './components/TodoMain.vue'
	import TodoHeader from './components/TodoHeader.vue'
	import TodoFooter from './components/TodoFooter.vue'
	import './styles/base.css'
	import './styles/index.css'
	export default {
		data() {
			return {
				list: [{
						id: 100,
						name: "吃饭",
						isDone: true
					},
					{
						id: 201,
						name: "睡觉",
						isDone: false
					},
					{
						id: 103,
						name: "打豆豆",
						isDone: true
					},
				],
			};
		},
		components:{
			TodoMain,
			TodoHeader,
			TodoFooter
		}
	};
</script>
